<!-- 
    加强版的文件上传
调用方式  pimgurl 默认图片
1. 图片   <upFile :pimgurl="form.cover" FileTitle="图片背景" @getFile="(data)=>form.cover=data"></upFile>
1.more=2 为多张 <upFile FileTitle="核心优势" @getFile="(data) => jjnseb.push(data)" more="2"></upFile>
2. 视频 <upFile FileTitle="设计理念视频" @getFile="(data)=>form.cover=data.url" accept=".mp4,.m4v"></upFile>
 -->
<template>
    <div class="w100 h100 sz vertical-center" @click="photoShowModal = true">
        <img :src="imgurl" class="w100 h100 imgjz" v-if="imgurl" />
        <span v-else>点击上传</span>
    </div>

    <n-modal v-model:show="photoShowModal" preset="card" class="Stock-diagnosis">
        <template #header>
            <div>{{ FileTitle }}</div>
        </template>
        <div>
            <photoGallery @getImg="getImg" :types="FileTitle + Userid" :accept="accept"></photoGallery>
        </div>
        <template #action>
            <div class="tr">
                <n-button @click="photoShowModal = false"> 取消 </n-button>
                <n-button class="ml10" type="info" @click="setImg"> 确定 </n-button>
            </div>
        </template>
    </n-modal>
</template>
<script lang='ts' setup>
import { ref } from "vue"
import photoGallery from "./photoGallery";
const photoShowModal = ref(false)
const Userid = ref(localStorage.id)
const imgurl = ref()
let jjnmnxe = "";

const props = defineProps({
    FileTitle: { type: String }, // 标题名称
    accept: { type: String }, // 文件类型
    more:{type: String}, //2 为多张
    pimgurl:{type: String},
});
if(props.pimgurl){
    imgurl.value = props.pimgurl
}


const emit = defineEmits([
    'getFile',
]);

const getImg = (data) => {
    jjnmnxe = data;
    console.log(data);
};
const setImg = () => {
    photoShowModal.value = false;
    emit("getFile", jjnmnxe)
    if(props.more=='2'){
        return
    }
    if(jjnmnxe.imgurl){
        imgurl.value = jjnmnxe.imgurl
    }else{
        imgurl.value = jjnmnxe
    }
  
};
</script>
<style scoped></style>